<template>
  <el-breadcrumb separator="-">
    <el-breadcrumb-item v-for="item in breadList" :key="item.path" :to="{ path: item.path }">{{ item.meta.title }}</el-breadcrumb-item>
  </el-breadcrumb>
</template>
<script setup>
import { computed } from "vue";
import { useRoute } from "vue-router";

const route = useRoute();
const breadList = computed(() => {
  let matched = route.matched.filter(item => item.meta && item.meta.title);
  const first = matched[0];
  if(first && first.path !== '/') matched = [{ path: '/', meta: { title: '首页' }}].concat(matched)
  return matched
})
</script>